import { PropsWithChildren } from 'react';
import { useEffect, FC, useState } from 'react';
import { View, Text } from '@tarojs/components'
import './index.less'
import { AtSwitch } from 'taro-ui'
import { useSetState } from '@hooks/index.ts'


const Index: FC<PropsWithChildren> = () => {
  const [subState, setSubState] = useSetState({
    reserve_remind: false,
    winning_remind: false,
    keyInfo_remind: false
  })

  useEffect(() => {
  }, []);

  const subHandleChange = (value: boolean, type: string) => {
    setSubState({ [type]: value })
  }

  return (
    <View className='huluwa-subscrible'>
      <View className="subscrible">
        <View className="subscrible-title">
          更省心，更省时
      </View>
        <View className='sub-body'>
          <View className='sub-body-one'>
            <AtSwitch title='葫芦娃开门提醒订阅' color='#fbd002' checked={subState.reserve_remind} onChange={(value) => subHandleChange(value, 'reserve_remind')} />
            <Text className='sub-body-desc'>葫芦娃官方若开门，我们将第一时间通知您。祝您一切顺利！</Text>
          </View>
          <View className='sub-body-two'>
            <AtSwitch title='葫芦娃中签提醒订阅' color='#fbd002' checked={subState.winning_remind} onChange={(value) => subHandleChange(value, 'winning_remind')} />
            <Text className='sub-body-desc'>葫芦娃预约结果一旦公布，我们将第一时间为您推送中签结果，不再需要额外登录官方小程序查询！祝您中签！</Text>
          </View>
          <View className='sub-body-three'>
            <AtSwitch title='重要撸货线报提醒订阅' color='#fbd002' checked={subState.keyInfo_remind} onChange={(value) => subHandleChange(value, 'keyInfo_remind')} />
            <Text className='sub-body-desc'>始于茅台，不止茅台。任何利润可观的撸货消息线报第一时间推送给您，快人一步！</Text>
          </View>

        </View>
      </View>
      <View className='care_desc'>
        温馨提示：以上操作都需要您
        <Text className='follow-our'> 关注我们的公众号 </Text>
        才能完成消息推送。除了推送以上消息我们不会为您推送任何无关消息，请放心关注。
      </View>
    </View>
  );
};

export default Index;